<template>
  <div>
    <el-timeline>
      <el-timeline-item
        v-for="item in process"
        :key="item.id"
        :type="
          item.isProcess == 0 ? '' : item.isProcess == 2 ? 'danger' : 'success'
        "
        :timestamp="item.checkType == 1 ? '发起人' : '审批'"
        placement="top"
      >
        <el-card>
          <el-descriptions border>
            <el-descriptions-item span="3" label="接收时间">{{
              item.createTime
            }}</el-descriptions-item>
            <el-descriptions-item
              span="3"
              v-if="item.updateTime"
              label="处理时间"
              >{{ item.updateTime }}</el-descriptions-item
            >
            <el-descriptions-item
              v-if="item.checkType == 1"
              span="3"
              label="发起人"
              >{{ item.stepUser }}</el-descriptions-item
            >
            <el-descriptions-item v-else span="3" label="审核人">{{
              item.stepUser
            }}</el-descriptions-item>
            <el-descriptions-item
              v-if="item.checkType == 2"
              span="3"
              label="状态"
            >
              <el-tag v-if="item.isProcess == 0" type="info">待审核</el-tag>
              <el-tag v-if="item.isProcess == 1" type="success">已审核</el-tag>
              <el-tag v-if="item.isProcess == 2" type="error">已驳回</el-tag>
              <el-tag v-if="item.isProcess == 3" type="error">已撤消</el-tag>
            </el-descriptions-item>
            <el-descriptions-item
              v-if="item.checkRemark"
              span="3"
              label="驳回原因"
              >{{ item.checkRemark }}</el-descriptions-item
            >
            <el-descriptions-item
              v-if="item.checkRemark"
              span="3"
              label="驳回至"
              >{{ item.rollOut }}</el-descriptions-item
            >
          </el-descriptions>
        </el-card>
      </el-timeline-item>
    </el-timeline>
  </div>
</template>
<script setup>
import { defineProps } from "vue";
const props = defineProps({
  processData: {
    type: Object,
    required: true,
  },
});
function mergeByTypeOnly(data) {
  const typeMap = new Map();

  for (const item of data) {
    const { stepNum, stepUser } = item;

    if (!typeMap.has(stepNum)) {
      // 保留第一条数据结构，初始化 name
      typeMap.set(stepNum, { ...item });
    } else {
      // 拼接 name
      const existing = typeMap.get(stepNum);
      existing.stepUser += "、" + stepUser;
    }
  }

  return Array.from(typeMap.values());
}
// const newProcess = mergeByTypeOnly(props.processData.itemList);

const process = ref(props.processData.itemList);
</script>
